<template>
  <div></div>
</template>

<script setup>
import { inject, onBeforeUnmount, onMounted } from 'vue'
// 注入map实例
let map = inject('mapscene').map
let center
let animationFrameId = null
//定义自转动画帧
const rotate = () => {
  center.lng += 0.1
  map.setCenter(center)
  center.lng = center.lng > 180 ? -180 : center.lng
  //requestAnimationFrame动画帧会返回一个id
  animationFrameId = requestAnimationFrame(rotate)
}
onMounted(() => {
  center = map.getCenter()
  map.setZoom(1)
  map.setPitch(0)
  rotate()
})

//离开页面时取消动画帧
onBeforeUnmount(() => {
  cancelAnimationFrame(animationFrameId)
})
</script>
<style lang="scss" scoped></style>
